<!-- 代码开始 -->
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <link rel="manifest" href="manifest.json">
       <link href="//itscn.coding.net/p/lite-new-page/d/lite-new-page/git/raw/master/css/toastr.min.css" rel="stylesheet">

<script src="//itscn.coding.net/p/lite-new-page/d/lite-new-page/git/raw/master/script/jquery.min.js"></script>
<script src="//itscn.coding.net/p/lite-new-page/d/lite-new-page/git/raw/master/script/toastr.min.js"></script>
    <title>New Page</title>
    <link rel="shortcut icon" href="https://i.loli.net/2020/05/13/uZSwoaRM4v5dLmf.png">
   <!-- 搜索引擎定位 -->
    <meta name="keywords" content="网址导航,开始,JBLOG,jblog,osgo,简约,浏览器,起始页">
    <meta name="description" content="浏览器起始页">
    <!-- 定位结束 -->
    <!-- 设定css -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="//itscn.coding.net/p/lite-new-page/d/lite-new-page/git/raw/master/css/style.css">
    <style>
        .imgzoom_pack {
            width: 100%;
            height: 100%;
            position: fixed;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            background: rgba(0, 0, 0, .7);
        }

        .imgzoom_pack .imgzoom_x {
            color: #fff;
            height: 30px;
            width: 30px;
            line-height: 30px;
            background: #000;
            text-align: center;
            position: absolute;
            right: 5px;
            top: 5px;
            z-index: 10;
            cursor: pointer;
        }

        .imgzoom_pack .imgzoom_img {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            overflow: hidden;
        }

        .imgzoom_pack .imgzoom_img img {
            width: 100%;
            position: absolute;
            top: 50%;
        }
        </style>
    <!-- 设定结束 -->
    <!-- 背景图片 -->
   
        <!-- 图片结束 -->
    <!-- 百度统计 -->
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?64fb0f2494ee2a704afd61b2cb57d0b3";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

<!-- 统计结束 -->
<!-- ALert -->

<!-- Alert -->
<!-- 设定css -->
    <style>
        *{margin: 0;padding: 0;outline: none}
body{background-image:url(//itscn.coding.net/p/lite-new-page/d/lite-new-page/git/raw/master/image/BG_A_Default_4.jpg);background-size:cover;background-repeat:no-repeat;background-attachment:fixed}
.container{
    /*background: #ddd;*/
    position: fixed;
    top: 25%;
    left: 15%;
    width: 70%;
    height: 70%;
}
h1{
    font-weight: 100;
    color: #aaa;
    font-size: 2.5rem;
    margin-bottom: 50px;
    text-align: center;
}
.input{
    position: relative;
    width: 650px;
    height: 60px;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 0 15px rgba(170,170,170,0.17);
    overflow: hidden;
}
/* button */
.btn-group{
    display: none;
    list-style: none;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 20px;
}
.btn-group li{
    display: inline-block;margin: 0 13px;width: 90px;height: 36px;line-height: 36px;
    text-align: center;color: #666;border-radius: 6px;background-color: #eee;
}
.btn-group li:hover{cursor: pointer;}
.btn-group .this{background-color: #ddd;}
/* 璁剧疆鏃舵樉绀� */
.set .btn-group{display: block;}
.set .input img{transform:rotate(90deg);}
    /* input */
.input img{
    position: absolute;left: 10px;top: 10px;width: 40px;height: 40px;transition: 1s;cursor: pointer;
}
.input input{position: absolute;border:none;left: 60px;top: 0;
    line-height: 60px;height: 60px;width: calc(100% - 60px);color: #666;font-size: 20px;}
.footer{text-align: center;position: fixed;width: 100vw;bottom: 45px;font-size: 12px;color: #a0a0a0;}
.footer a{color: #666;}

@media screen and (max-width: 768px) {
    .container{width: 90%;left: 5%;}
    .input{width: 100%;height: 50px;}
    .input img{width: 30px;height: 30px;}
    .input input{height: 50px;left: 50px;width: calc(100% - 50px);}
    .btn-group:after {
        content: '\20';
        clear: both;
        display: block;
        height: 0;
    }
    .btn-group li{
        float: left;
        margin: 0;
        width: 23%;
        margin-right: 2.6666666%;
        height: 26px;
        line-height: 26px;
        font-size: 13px;
        border-radius: 3px;
    }
    .btn-group li:last-child{
        margin-right: 0;
    }
}
</style>
<!-- 设定结束 -->
<!-- 时钟 -->
<script>
    function clickEffect() {
    let balls = [];
    let longPressed = false;
    let longPress;
    let multiplier = 0;
    let width, height;
    let origin;
    let normal;
    let ctx;
    const colours = ["#F73859", "#14FFEC", "#00E0FF", "#FF99FE", "#FAF15D"];
    const canvas = document.createElement("canvas");
    document.body.appendChild(canvas);
    canvas.setAttribute("style", "width: 100%; height: 100%; top: 0; left: 0; z-index: 99999; position: fixed; pointer-events: none;");
    const pointer = document.createElement("span");
    pointer.classList.add("pointer");
    document.body.appendChild(pointer);

    if (canvas.getContext && window.addEventListener) {
        ctx = canvas.getContext("2d");
        updateSize();
        window.addEventListener('resize', updateSize, false);
        loop();
        window.addEventListener("mousedown", function(e) {
            pushBalls(randBetween(10, 20), e.clientX, e.clientY);
            document.body.classList.add("is-pressed");
            longPress = setTimeout(function() {
                document.body.classList.add("is-longpress");
                longPressed = true;
            }, 500);
        }, false);
        window.addEventListener("mouseup", function(e) {
            clearInterval(longPress);
            if (longPressed == true) {
                document.body.classList.remove("is-longpress");
                pushBalls(randBetween(50 + Math.ceil(multiplier), 100 + Math.ceil(multiplier)), e.clientX, e.clientY);
                longPressed = false;
            }
            document.body.classList.remove("is-pressed");
        }, false);
        window.addEventListener("mousemove", function(e) {
            let x = e.clientX;
            let y = e.clientY;
            pointer.style.top = y + "px";
            pointer.style.left = x + "px";
        }, false);
    } else {
        console.log("canvas or addEventListener is unsupported!");
    }


    function updateSize() {
        canvas.width = window.innerWidth * 2;
        canvas.height = window.innerHeight * 2;
        canvas.style.width = window.innerWidth + 'px';
        canvas.style.height = window.innerHeight + 'px';
        ctx.scale(2, 2);
        width = (canvas.width = window.innerWidth);
        height = (canvas.height = window.innerHeight);
        origin = {
            x: width / 2,
            y: height / 2
        };
        normal = {
            x: width / 2,
            y: height / 2
        };
    }
    class Ball {
        constructor(x = origin.x, y = origin.y) {
            this.x = x;
            this.y = y;
            this.angle = Math.PI * 2 * Math.random();
            if (longPressed == true) {
                this.multiplier = randBetween(14 + multiplier, 15 + multiplier);
            } else {
                this.multiplier = randBetween(6, 12);
            }
            this.vx = (this.multiplier + Math.random() * 0.5) * Math.cos(this.angle);
            this.vy = (this.multiplier + Math.random() * 0.5) * Math.sin(this.angle);
            this.r = randBetween(8, 12) + 3 * Math.random();
            this.color = colours[Math.floor(Math.random() * colours.length)];
        }
        update() {
            this.x += this.vx - normal.x;
            this.y += this.vy - normal.y;
            normal.x = -2 / window.innerWidth * Math.sin(this.angle);
            normal.y = -2 / window.innerHeight * Math.cos(this.angle);
            this.r -= 0.3;
            this.vx *= 0.9;
            this.vy *= 0.9;
        }
    }

    function pushBalls(count = 1, x = origin.x, y = origin.y) {
        for (let i = 0; i < count; i++) {
            balls.push(new Ball(x, y));
        }
    }

    function randBetween(min, max) {
        return Math.floor(Math.random() * max) + min;
    }

    function loop() {
        ctx.fillStyle = "rgba(255, 255, 255, 0)";
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        for (let i = 0; i < balls.length; i++) {
            let b = balls[i];
            if (b.r < 0) continue;
            ctx.fillStyle = b.color;
            ctx.beginPath();
            ctx.arc(b.x, b.y, b.r, 0, Math.PI * 2, false);
            ctx.fill();
            b.update();
        }
        if (longPressed == true) {
            multiplier += 0.2;
        } else if (!longPressed && multiplier >= 0) {
            multiplier -= 0.4;
        }
        removeBall();
        requestAnimationFrame(loop);
    }

    function removeBall() {
        for (let i = 0; i < balls.length; i++) {
            let b = balls[i];
            if (b.x + b.r < 0 || b.x - b.r > width || b.y + b.r < 0 || b.y - b.r > height || b.r < 0) {
                balls.splice(i, 1);
            }
        }
    }
}
</script>
<script>
 function startTime()   
        {   
            var today=new Date();//定义日期对象   
            var yyyy = today.getFullYear();//通过日期对象的getFullYear()方法返回年    
            var MM = today.getMonth()+1;//通过日期对象的getMonth()方法返回年    
            var dd = today.getDate();//通过日期对象的getDate()方法返回年     
            var hh=today.getHours();//通过日期对象的getHours方法返回小时   
            var mm=today.getMinutes();//通过日期对象的getMinutes方法返回分钟   
            var ss=today.getSeconds();//通过日期对象的getSeconds方法返回秒7a64e78988e69d8331333363363537   
            // 如果分钟或小时的值小于10，则在其值前加0，比如如果时间是下午3点20分9秒的话，则显示15：20：09   
            MM=checkTime(MM);
            dd=checkTime(dd);
            mm=checkTime(mm);   
            ss=checkTime(ss);    
            var day; //用于保存星期（getDay()方法得到星期编号）
            if(today.getDay()==0)   day   =   "星期日 " 
            if(today.getDay()==1)   day   =   "星期一 " 
            if(today.getDay()==2)   day   =   "星期二 " 
            if(today.getDay()==3)   day   =   "星期三 " 
            if(today.getDay()==4)   day   =   "星期四 " 
            if(today.getDay()==5)   day   =   "星期五 " 
            if(today.getDay()==6)   day   =   "星期六 " 
            document.getElementById('nowDateTimeSpan').innerHTML=hh+":"+mm+":"+ss;   
            setTimeout('startTime()',1000);//每一秒中重新加载startTime()方法 
        }   
         
        function checkTime(i)   
        {   
            if (i<10){
                i="0" + i;
            }   
              return i;
        }  
    </script>
    <!-- 时钟结束 -->
</head>
<body onload="startTime()">
    <!--onmousedown="clickEffect()"-->
    <script>
toastr.options = {
  "closeButton": true,
  "debug": false,
  "positionClass": "toast-top-right",
  "onclick": null,
  "showDuration": "300",
  "hideDuration": "1000",
  "timeOut": "5000",
  "extendedTimeOut": "1000",
  "showEasing": "swing",
  "hideEasing": "linear",
  "showMethod": "fadeIn",
  "hideMethod": "fadeOut"
}
//toastr.info("我们的新网址（<a href ='https://s.r3r.top'>s.r3r.top</a>），主机部署在GitHub！", "新消息")
toastr.info("您的起始页已增加 夸克 Quark AI 搜索引擎！赶快试试吧！", "最新通知")
</script>
<div> 
<div class="container">
    <h1><a href="bbx.html" style='color:#fff'><span id="nowDateTimeSpan"></span></a></h1>
    
    <ul class="btn-group">
        <li data-logo="logo_baidu">Baidu</li>
        <li data-logo="logo_google">Google</li>
        <li data-logo="logo_bing">Bing</li>
        <li data-logo="logo_doge">Doge</li>
        <li data-logo="logo_lookao">Lookao</li>
        <li data-logo="logo_zhihu">ZhiHu</li>
        <li data-logo="logo_quark">Quark</li>
        
    </ul>
    <div class="input">
        <img src="" id="set">
        <input type="text" placeholder="按下回车完成搜索" id="searchInput" autocomplete="off" >
    </div>
    
</div>
<!-- 开源不易，请勿删除版权信息，如需删除，请私信哔哩哔哩（UID：535131718） -->

<!-- 版权开始 -->
<div class="footer">
    <a href="about.html"style='color:#000'>©2020 JunJun</a><br><br>
    <!--<a href="https://afdian.net/@os-go"style='color:#000000'>打赏</a>  &  <a href='https://support.qq.com/products/153198?'style='color:#000000'>反馈</a>-->
    
</div>
<!-- 版权结束 -->
<!-- 开源不易，请勿删除版权信息，如需删除，请私信哔哩哔哩（UID：535131718） -->
<!--<script type="text/javascript" src="jquery.slim.min.js"></script>-->
<script type="text/javascript" src="zepto.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</div>
</body>
</html>